﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript" src="Scripts/angular.js"></script>
</head>
<body ng-app="myApp" >

    <!--<runoob-directive></runoob-directive>
    <div runoob-directive></div>
    
    <script>
        var app = angular.module("myApp", []);
        app.directive("runoobDirective", function () {
            return {
                template: "<h1>自定义指令!</h1>"
            };
        });
    </script>-->

    <!--<div class="runoob-directive"></div>

    <script>
        var app = angular.module("myApp", []);
        app.directive("runoobDirective", function () {
            return {
                restrict: "C",
                template: "<h1>自定义指令!</h1>"
            };
        });
    </script>-->
    <script>
        var app = angular.module("myApp", []);
        app.directive("runoobDirective", function () {
            return {
                restrict: "M",
                replace: true,
                template: "<h1>自定义指令!</h1>"
            };
        });
    </script>

    <p><strong>注意：</strong> 我们需要在该实例添加 <strong>replace</strong> 属性， 否则评论是不可见的。</p>

    <p><strong>注意：</strong> 你必须设置 <b>restrict</b> 的值为 "M" 才能通过注释来调用指令。</p>
    <!--restrict 值可以是以下几种:
    E 作为元素名使用
    A 作为属性使用
    C 作为类名使用
    M 作为注释使用
    restrict 默认值为 EA, 即可以通过元素名和属性名来调用指令。
        -->
</body>
</html>